<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{% block title %}PDMReader{% endblock %}</title>
    <link href="/static/bootstrap5/css/bootstrap.min.css" rel="stylesheet">
    {% block head %}
    {% endblock %}
</head>
<body class="d-flex flex-column min-vh-100">

<!-- 导航栏 -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
    <div class="container-fluid">
        <a class="navbar-brand" href="/">PDMReader</a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarContent"
                aria-controls="navbarContent" aria-expanded="false" aria-label="切换导航">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="navbarContent">
            <!-- 左侧导航菜单 -->
            <ul class="navbar-nav me-auto mb-2 mb-lg-0">
                <li class="nav-item">
                    <a class="nav-link" href="/">首页</a>
                </li>
                <!-- 其他菜单项 -->
            </ul>

            <!-- 右侧用户信息 -->
            {% if current_user.is_authenticated %}
            <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle d-flex align-items-center" href="#" id="userDropdown"
                       role="button" data-bs-toggle="dropdown" aria-expanded="false">
                        <img src="{{ current_user.avatar_url or url_for('static', filename='images/default-avatar.png') }}"
                             alt="avatar" width="32" height="32" class="rounded-circle me-2">
                        {{ current_user.username }}
                    </a>
                    <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="userDropdown">
                        <li><a class="dropdown-item" href="#">个人中心</a></li>
                        <li>
                            <hr class="dropdown-divider">
                        </li>
                        <li><a class="dropdown-item" href="{{ url_for('app.logout') }}">退出登录</a></li>
                    </ul>
                </li>
            </ul>
            {% endif %}
        </div>
    </div>
</nav>


<!-- 主体内容 -->
<main class="container my-4 flex-grow-1">
    {% block content %}
    <!-- 页面具体内容由子模板插入 -->
    {% endblock %}
</main>

<!-- 页脚 -->
<footer class="bg-light text-center py-3 mt-auto">
    <div class="container">
        <span class="text-muted">&copy; {{ current_year }} {{ app_name }} by {{by}} | 由 Flask + Bootstrap 5 驱动</span>
    </div>
</footer>

<script src="/static/bootstrap5/js/bootstrap.bundle.min.js"></script>
</body>
</html>
